.footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 16rpx 0;
  padding-bottom: calc(16rpx + env(safe-area-inset-bottom));
  background-color: #fff;
  border-top: 1rpx solid #eee;
  z-index: 100;

  .footer-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8rpx;

    .footer-text {
      font-size: 24rpx;
      color: #999;
    }

    &.active {
      .footer-text {
        color: #e54d42;
      }
    }
  }
}
